/* eslint-disable */
<<template>
        <div :style="{height:height+'px',width:width+'px'}">
            <div class="charts"  ref="chart" :style="{height:height+'px',width:width+'px'}"></div>
        </div>
</template>
<style lang="less" scoped>
    .charts {
        overflow:auto;
        // width:100%;
        // height:100%;
    }
</style>

<<script>
import Echarts from 'echarts'

export default {
    props: {
        target: Object
    },
    data () {
        return {
            charts: {}
        }
    },
    methods: {
    },
    computed: {
        width: {
            get () {
                this.$nextTick(() => {
                    this.charts.resize()
                })
                return this.$props.target.props.width.value
            }
        },
        height: {
            get () {
                this.$nextTick(() => {
                    this.charts.resize()
                })
                return this.$props.target.props.height.value
            }
        },
        option: {
            get () {
                let option = this.$props.target.data.option
                return option
            }
        }
        // currentPage: {
        //     get () {
        //         let page = this.$store.state.designer.currentPage
        //         if (this.$props.target.name.indexOf(page.name) === 0) {
        //             this.$nextTick(() => {
        //                 this.charts.setOption(this.$props.target.data.option)
        //             })
        //         }
        //         return page
        //     }
        // }
    },
    watch: {
        option () {
            let option = this.$props.target.data.option
            this.$nextTick(() => {
                this.charts.clear()
                this.charts.setOption(option)
            })
        }
    },
    components: {
    },
    mounted () {
        this.$nextTick(() => {
            this.charts.setOption(this.$props.target.data.option)
        })
        this.charts = Echarts.init(this.$refs.chart)
    }
}
</script>
